<template>
  <div id="task" style="width: 1100px;margin-left: 15%">
    <div style="border: 2px solid #d6d6d6;padding: 20px;height: auto">
      <el-tabs v-model="activeName" @tab-click="handleClick">
        <el-tab-pane name="1">
          <span slot="label"><i class="el-icon-date"></i>签到</span>
          签到
        </el-tab-pane>
        <el-tab-pane name="2">
          <span slot="label"><i class="el-icon-check"></i>投票</span>
          投票
        </el-tab-pane>
        <el-tab-pane name="3">
          <span slot="label"><i class="el-icon-user"></i>选人</span>
          选人
        </el-tab-pane>
        <el-tab-pane name="4">
          <span slot="label"><i class="el-icon-loading"></i>抢答</span>
          抢答
        </el-tab-pane>
        <el-tab-pane name="5">
          <span slot="label"><i class="el-icon-chat-line-round"></i>主题讨论</span>
          主题讨论
        </el-tab-pane>
        <el-tab-pane name="6">
          <span slot="label"><i class="el-icon-tickets"></i>随堂练习</span>
          随堂练习
        </el-tab-pane>
        <el-tab-pane name="7">
          <span slot="label"><i class="el-icon-document"></i>问卷</span>
          问卷
        </el-tab-pane>
        <el-tab-pane name="8">
          <span slot="label"><i class="el-icon-document-checked"></i>评分</span>
          评分
        </el-tab-pane>
        <el-tab-pane name="9">
          <span slot="label"><i class="el-icon-coordinate"></i>分组任务</span>
          分组任务
        </el-tab-pane>
        <el-tab-pane name="10">
          <span slot="label"><i class="el-icon-receiving"></i>活动库</span>
          活动库
        </el-tab-pane>
      </el-tabs>
    </div>
    <div style="border-bottom: 2px solid #b3b3b3">
      <h3 style="border-left: 5px solid #7b9e31;">
        &nbsp;进行中({{ count1 }})
      </h3>
    </div>
    <div>
      <h3 style="border-left: 5px solid #9b9b9b;">
        &nbsp;已结束({{ count2 }})
      </h3>
    </div>
  </div>
</template>

<script>
export default {
  name: "Task",
  data() {
    return {
      activeName: '1',
      count1:'0',
      count2:'0'
    }
  },
  methods: {
    handleClick(tab, event) {
      console.log(tab, event);
    }
  }
}
</script>

<style scoped>

</style>
